<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no,target-densitydpi=medium-dpi" />
		<link href="css/mui.css" rel="stylesheet" />
	</head>

	<body>
		
		<div style=" width:600px; height:900px;background: url('images/background.jpg');margin: 0 auto;" id="main">
			<div style="width:600px; height:900px;background: url('images/bg_gradient_mask.png');background-size: 100% 100%;position: relative;" id="">
				<!-- 1-1 -->
			<div style=" position: relative; width:190px;height: 45px;background: url('images/bg_status.png');background-size: 100% 100%;display: inline-block;padding-left: 10px;;">
				<div style="width: 60px;height: 40px;background: url('images/icon_rank.png');background-size: 100% 100%;display: inline-block;">
				</div>
				<div style="position: absolute;left: 30px;top:0px;line-height: 10px;" id="">
					<p style="color: #ffff7f;font-size: 16px;">99</p>
				</div>
				<div style="position: absolute;left: 70px;top:0px;line-height: 6px;" id="">
					<p style="color: #ffff7f;font-size: 20px;">卢克断手者</p>
				</div>
			</div>
			<!-- 1-2 -->
			<div style=" position: relative;  width:190px;height: 45px;background: url('images/bg_status.png');background-size: 100% 100%;display: inline-block;" >
				<div style="width: 60px;height: 40px;background: url('images/icon_diamond.png');background-size: 100% 100%;display: inline-block;">
				</div>
				
				<div style="position: absolute;left: 65px;top:0px;line-height: 6px; " id="">
					<p style="color: #ffff7f;font-size: 20px;">6688999</p>
				</div>
				
			</div>
			<!-- 1-3 -->
			<div style=" position: relative; width:190px;height: 45px ;background: url('images/bg_status.png');background-size: 100% 100%;display: inline-block;" >
				<div style="width: 60px;height: 40px;background: url('images/icon_gold.png');background-size: 100% 100%;">
				</div>
				<div style="position: absolute; left: 75px;top:0px;line-height: 6px; " id="">
					<p style="color: #ffff7f;font-size: 20px;">999999</p>
				</div>
			</div>
			<br><br>
			<div id="main_2">
			<!-- 2-1 -->
				<div style="position: relative; width: 290px;height: 43px;background: url('images/bg_timer.png');background-size: 100% 100%;display: inline-block;margin-left: 10px;" id="main_2_1">
					<div style="width: 60px;height: 40px;background: url('images/icon_fight.png');background-size: 100% 100%;display: inline-block;">
					</div>
					<div id=""  style=" position: absolute; width: 205px;height:40px;display: inline-block;">
						<div id="" style=""><span style="color:#ffff7f;">剩余时间</span>&nbsp;<span style="color:#aaffff;">0:08</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ffff7f ;">57/120</span></div>
						<div id=""><img style="width: 200px;height: 12px;float: left;position: absolute;z-index: -1;" src="images/bg_timer.png" >
						</div>
						<img style="position: absolute;z-index: 200; top: 1.5rem;left: 0.1rem;height: 0.75rem;width: 13rem;" src="images/timer_slot.png" >
						<img style="position: absolute;z-index: 200; top: 1.5rem;left: 0.1rem;height: 0.6rem;width: 8rem;" src="images/timer_bar.png" >
					</div>
				</div>
			<!-- 2-2 -->
				<div style="position: relative; width: 290px;height: 43px;background: url('images/bg_timer.png');background-size: 100% 100%;display: inline-block;" id="main_2_2">
					<div style="width: 60px;height: 40px;background: url('images/icon_energy.png');background-size: 100% 100%;display: inline-block;">
					</div>
					<div id=""  style=" position: absolute; width: 205px;height:40px;display: inline-block;">
						<div id="" style=""><span style="color:#ffff7f;">剩余时间</span>&nbsp;<span style="color:#aaffff;">1:23</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ffff7f ;">18/80</span></div>
						<div id=""><img style=" position: absolute; width: 200px;height: 12px;z-index: -1;" src="images/bg_timer.png" >
						</div>
						<img style="position: absolute;z-index: 200; top: 1.5rem;left:0.1rem;height: 0.75rem;width: 13rem;" src="images/timer_slot.png" >
						<img style="position: absolute;z-index: 200; top: 1.5rem;left:0.1rem;height: 0.6rem;width: 2rem;border-radius: 0.3rem;" src="images/timer_bar.png" >
					</div>
				</div>
			<!-- 3-1 -->
			<br>
			<br>
			<img src="images/btn_message.png" >
			<!-- 4-->
				<div id="" style="position: relative;margin-top: 450px;">
			<!-- 4-1 -->
					<div id="" style="width: 570px;height: 100px;background: url(images/bg_main_btns.png);background-size: 100% 100%;margin: 0 auto;">
						<img style="margin-top: 20px;margin-left: 40px;;" src="images/btn_backpack.png" >
						<img src="images/btn_rongyu.png" >
						<img src="images/btn_liuyan.png" >
						<img src="images/btn_renwu.png" >
						<img src="images/btn_chuzhan.png" >
						<img src="images/btn_hecheng.png" >
						<img style="position: absolute;left:65px;top:50px;" src="images/txt_beibao.png" >
						<img style="position: absolute;left:155px;top:50px;" src="images/txt_rongyu.png" >
						<img style="position: absolute;left:235px;top:50px;" src="images/txt_liuyan.png" >
						<img style="position: absolute;left:315px;top:50px;" src="images/txt_renwu.png" >
						<img style="position: absolute;left:395px;top:50px;" src="images/txt_chuzhan.png" >
						<img style="position: absolute;left:480px;top:50px;" src="images/txt_hecheng.png" >
						<img style="position: absolute;left:265px;top:2px;width: 90px;height: 20px;" src="images/btn_fold.png" >
						
					</div>
			<!-- 4-2 -->
					<div id="">
						<div id="" style="width: 600px;height: 150px;background: url(images/bg_main_btns.png);background-size: 100% 100%;margin: 0 auto;">
						<img style="margin-top: 25px;width:80px;height: 100px;padding-left: 20px;" src="images/btn_home.png" >
						<img style="margin-top: 25px;width:80px;height: 100px;padding-left: 10px;" src="images/btn_level.png" >
						<img style="margin-top: 25px;width:80px;height: 100px;padding-left: 10px;"  src="images/btn_raid.png" >
						<img style="margin-top: 25px;width:80px;height: 100px;padding-left: 10px;"  src="images/btn_shop.png" >
						<img style="margin-top: 25px;width:80px;height: 100px;padding-left: 10px;"  src="images/btn_friends.png" >
						<img style="margin-top: 25px;width:80px;height: 100px;padding-left: 10px;"  src="images/btn_setting.png" >
							
						</div>
					</div>
				</div>
			</div> 
		</div>
		</div>
	</body>

</html>
